﻿<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>{TITLE}</title>
	<link rel="shortcut icon" href="/favicon.ico" />
	<link rel="icon" href="{U_STATIC}/favicon-32.png" sizes="32x32" />
    <link rel="apple-touch-icon" href="{U_STATIC}/favicon-129.png"/>
	<link href="{U_STATIC}/styles/boxsocial.css" rel="Stylesheet" media="screen, projection" type="text/css"/>
    <link href="{U_STATIC}/styles/jquery-ui-1.10.3.boxsocial.min.css" rel="Stylesheet" media="screen, projection" type="text/css"/>
	<!-- BEGIN style_sheet_list -->
	<link href="{style_sheet_list.URI}" rel="Stylesheet" media="screen, projection" type="text/css"/>
	<!-- END style_sheet_list -->
	<!-- IF CANONICAL_URI -->
	<link rel="canonical" href="{CANONICAL_URI}" />
	<!-- ENDIF -->
    <meta name="viewport" content="width=device-width" />
	<!-- IF REDIRECT_URI -->
	<meta http-equiv="refresh" content="3;url={REDIRECT_URI}" />
	<!-- ENDIF -->
    <!-- BEGIN meta_list -->
    <meta name="{meta_list.NAME}" content="{meta_list.CONTENT}" />
    <!-- END meta_list -->
	<style type="text/css">
		<!--

#head, .breadcrumbs {
	background-color: #{HEAD_COLOUR};
	color: {HEAD_FORE_COLOUR};
}

#head h1 {
	background-image: url('/images/boxsocial-logo.png');
}

#head a {
	color: {HEAD_FORE_COLOUR};
}

--></style>
	<!-- IF USER_STYLE_SHEET -->
	<link href="/styles/{USER_STYLE_SHEET}" rel="Stylesheet" media="screen, projection" type="text/css"/>
	<!-- ENDIF -->
    <script type="text/javascript" src="{U_STATIC}/scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="{U_STATIC}/scripts/jquery-ui-1.10.3.boxsocial.min.js"></script>
    <script type="text/javascript" src="{U_STATIC}/scripts/jquery.history.js"></script>
    <script type="text/javascript" src="{U_STATIC}/scripts/ajax.common.min.js"></script>
    <script type="text/javascript" src="{U_STATIC}/scripts/ajax.desktop.min.js"></script>
	<script type="text/javascript">
	<!--
        var sid = '{SID}';
        var itvid = '0{ITEM_VIEW_ID}';
        var ownerStub = '{OWNER_STUB}';
        var medium = 'desktop';
        var lang = {
            'POST_A_COMMENT': '{L_POST_A_COMMENT}',
            'SHARE_SOMETHING_INTERESTING': '{L_SHARE_SOMETHING_INTERESTING}'
	    };
        var queryMode = '';

    <!-- IF S_TRIM_SID -->
	    $(document).ready(function () {
	        var History = window.History
	        if (History.enabled) {
	            var u = window.location.href;
	            if (u.indexOf("?sid=" + sid, u.length - sid.length - 5) !== -1) {
	                History.replaceState(null, null, u.substring(0, u.length - sid.length - 5));
	            }
	        }
	    });
    <!-- ENDIF -->
	-->
	</script>
	<!-- BEGIN javascript_list -->
    <script type="text/javascript" src="{javascript_list.URI}"></script>
	<!-- END javascript_list -->
    <!-- IF ANALYTICS_CODE -->
    <script type="text/javascript">

        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', '{ANALYTICS_CODE}']);
        _gaq.push(['_trackPageview']);

        (function () {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();

    </script>
    <!-- ENDIF -->
</head>
<body>
    <div id="share-form"></div>
	<div id="wrapper">
	<div id="page">
        <div id="dialog-message"></div>
        <!-- IF S_HEADER -->
        <!-- IF COLLAPSE_HEADER -->
  <div id="overview-profile" class="pane">
		<div class="img-circ img-fl">
			<!-- IF PRIMITIVE_TILE -->
			<img src="{PRIMITIVE_TILE}" data-at2x="{PRIMITIVE_SQUARE}" alt="{PRIMITIVE_DISPLAY_NAME}" />
			<!-- ELSE -->
			<div class="no-disp-pic">{L_NO_PICTURE}</div>
            <!-- ENDIF -->
		</div>
        <!-- IF PRIMITIVE_COVER_PHOTO -->
	  <div class="info parallax" style="height: 100px; background-image: url('{PRIMITIVE_COVER_PHOTO}');">
        <!-- ELSE -->
        <div class="info">
        <!-- ENDIF -->
            <!-- ELSE -->
            <div id="head">
                <h1 id="page-title"><a href="{U_HOME}"><span>{HEADING}</span></a></h1>
                <!-- IF SITE_SLOGAN -->
                <h2 id="sub-title">{SITE_SLOGAN}</h2>
                <!-- ENDIF -->
            <!-- ENDIF -->
                <div id="head-nav">
                    <!-- IF LOGGED_IN -->
                    {L_GREETING} <a href="{U_USER_PROFILE}">{USERNAME}</a> |
                    <a href="{U_ACCOUNT}">{L_MY_ACCOUNT}</a>
                    <!-- IF UNREAD_NOTIFICATIONS -->
                    <a id="notifications-tile" href="{U_ACCOUNT}" title="{L_NOTIFICATIONS}"><span class="notifications">{UNREAD_NOTIFICATIONS}</span></a>
                    <!-- ELSE -->
                    <a id="notifications-tile" title="{L_NOTIFICATIONS}" style="display: none;" href="{U_ACCOUNT}"><span class="notifications">{UNREAD_NOTIFICATIONS}</span></a>
                    <!-- ENDIF -->
                    <!-- IF UNSEEN_MAIL -->
                    <a id="mail-notifications-tile" href="{U_UNSEEN_MAIL}" title="{L_NEW_MESSAGES}"><span class="mail-notifications">&nbsp;</span></a>
                    <!-- ELSE -->
                    <a id="mail-notifications-tile" style="display: none;" href="{U_UNSEEN_MAIL}" title="{L_NEW_MESSAGES}"><span class="mail-notifications">&nbsp;</span></a>
                    <!-- ENDIF -->
                    |
                    <a href="{U_SIGNOUT}">{L_SIGNOUT}</a> |
                    <!-- ELSE -->
                    <a href="{U_REGISTER}">{L_REGISTER}</a> |
                    <a href="{U_SIGNIN}">{L_SIGNIN}</a> |
                    <!-- ENDIF -->
                    <a href="{U_HELP}">{L_HELP}</a>
                </div>
                <div id="search">
                    <form action="{S_SEARCH}" method="get">
                        <fieldset>
                            <input type="text" id="search-text" name="q" value="{SEARCH_QUERY}" maxlength="127" /><input type="submit" value="{L_SEARCH}" />
                        </fieldset>
                    </form>
                </div>
            <!-- IF COLLAPSE_HEADER -->
                <h2>{PAGE_TITLE}</h2>
                <!-- IF PAGE_SUB_TITLE -->
                <h2>{PAGE_SUB_TITLE}</h2>
                <!-- ENDIF -->
                </div>
            </div>
        <!-- BEGIN primitive_head_hook -->
        {primitive_head_hook.BODY}
        <!-- END primitive_head_hook -->
            <!-- ELSE -->
            </div>
            <!-- ENDIF -->
            <!-- ENDIF -->
            <!-- BEGIN head_hook -->
            {head_hook.BODY}
            <!-- END head_hook -->
            <div id="body">
